<template>
  <!-- 评论盒子 -->
       <div class="pinglun-box" >
        <div class="pinglun-boxa" v-for="(v,i) in arr" :key="i">
         <div class="box-top" >
           <div class="img-box">
              <img :src="v.imga" alt="" class="imga">
           </div>
           <div class="nam-box"><span class="sp1">{{v.sp1}}</span> </div>
           <div class="data-box"><span class="sp2">{{v.sp2}}</span> </div>
         </div>
         <div class="box-center">
           <div class="haoping-box">
                <img :src="v.imgb" alt="" class="imgb">
           </div>
         </div>
         <div class="box-bottom">
           <p class="ptext">{{v.ptext}}</p>
         </div>
    </div>
   </div>
</template>

<script>
export default {
    props:["arr"],
}
</script>

<style>
.pinglun-boxa{
  width: 97%;
  height: 1rem;
  /* background-color:palegoldenrod; */
  margin: auto;
  border-bottom: 1px solid #888888;
  /* margin-top: 0.4rem; */
}
.pinglun-box{
  width: 100%;
  /* height: 100rem; */
  /* background-color:palegoldenrod; */
  margin: auto;
  border-bottom: 1px solid #888888;
}
.box-top{
  width: 100%;
  height: 0.4rem;
  /* background-color:paleturquoise; */
  display: flex;
}
 .img-box{
  width: 0.4rem;
  height: 0.4rem;
  /* background-color:red; */
  margin-top: 20%;
  margin-top: 0rem;

} 
.nam-box{
  width: 1rem;
  height: 0.4rem;
  /* background-color:red; */
  margin-left: 0.1rem;
}
.data-box{
   width: 1rem;
  height: 0.4rem;
  /* background-color:hotpink; */
  margin-left: 1rem;
  text-align: right;
  color: #888888;
}
.nam{
    width: 2.5rem;
    height: 0.4rem;
    /* background-color:salmon; */
}
.img-box .imga{
   width: 0.4rem;
  height: 0.4rem;
    border-radius: 50%;
}
.box-center{
  width: 100%;
  height: 0.3rem;
  /* background-color:springgreen; */
}
.haoping-box{
  width: 30%;
  height: 100%;
  background-color: #fff;
}
.haoping-box .imgb{
    width: 40%;
  height: 80%;
  margin-left:0.4rem;
}
.box-bottom .ptext{
  width: 100%;
  height: 0.4rem;
  margin-left: 0.4rem;
  line-height: 0.3rem;
}
 .content{
      width: 100%;
      height: 0.3rem;
      /* background-color:gold; */
      margin-top: 0.08rem;
      border-bottom: 1px solid #777777; 
 }
</style>